<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../js/vue.js"></script>
</head>
<body>
   <div id="app">
        <!-- 内置指令 v-*** -->
        <!-- 1. v-model 双向数据绑定。数据层->视图层，视图层->数据层 -->
        <input type="text" v-model="msg">
        <!-- 2. v-text 插入文本内容 -->
        <p v-text="msg"></p>
        <p>{{msg}}</p>
        <!-- 2. v-html 插入包含标签的内容，还能解析标签 -->
        <p v-html="msg2"></p>
   </div>
   <script>
       new Vue({
            el: '#app',
            data: {
                msg: 'hello,world!',
                msg2: '<span>嘻嘻嘻</span>'
            }
       })
   </script>
</body>
</html>